<!--

  内容区售后服务
  
-->

<template>
    <div class="contain">
        <el-row >
  
                   <el-button type="primary"
                    plain class="aa"
                    
                     >参数设置</el-button>
                   <el-button type="success" plain>服务项目</el-button>
                   <el-button type="info" plain>综合评价</el-button>
                   
                   
 </el-row>
 <div class="tu">
            <img   class="s1" src="../../assets/green/shouhou-1.png" />
             <img   class="s1 s2 " src="../../assets/green/shouhou-2.png" />
                <img   class="s1 s3 " src="../../assets/green/shouhou-3.png" />
                   <img   class="s1 s4 " src="../../assets/green/shouhou-4.png" />
                     <span class="text"> 维修派工单</span>
                     <span class="text t2"> 维修领料单</span>
                     <span class="text t3"> 维修完工单</span>
                     <span class="text t4"> 维修报废单</span> 

    </div>
    </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
    .contain{
        height: 100%;
    }
    .aa{
        margin-left:60px
    }
  .el-button{
       margin-top: 20px;
    color: #b0b0b0;
    background: #5a5a5a;
    border-color: #5a5a5a;
        transition: 1.1s;
   }
   .tu{
    position: relative;
    height: 88%;
    width:72%;
    }
    .s1{
        position: absolute;
    top: 20%;
    left: 11%;
    height: 32.172%;
    width: 14.75%;
    cursor: pointer;
    }
    .s2{
         left:30%;
        width: 13.12%;
    }
    .s3{
        left:49%;
        width: 13.206%;
    }
    .s4{
        left:68%;
       width: 14.406%;
    }
    .text{
    position: absolute;
    bottom: 35%;
    left: 14%;
    font-size: 16px;
    color: #473e3f;
    font-weight: 300;
    }
    .t2{
        left: 33%;
    }
    .t3{
        left: 52.5%;
    }
    .t4{
        left: 71.5%;
    }
</style>
